<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">

<head>

    <meta charset="utf-8"/>
    <meta name="viewport" content="width=device-width, initial-scale=1.0"/>


    <title>草稿</title>
    <link th:href="@{/css/bootstrap.min.css}" rel="stylesheet"/>
    <link th:href="@{/css/font-awesome.css}" rel="stylesheet"/>
    <link th:href="@{/css/plugins/iCheck/custom.css}" rel="stylesheet"/>
    <link th:href="@{/css/animate.css}" rel="stylesheet"/>
    <link th:href="@{/css/style.css}" rel="stylesheet"/>

</head>

<body class="gray-bg">
<div class="wrapper wrapper-content">
    <div class="row">
        <div class="col-sm-3">
            <div class="ibox float-e-margins">
                <div class="ibox-content mailbox-content">
                    <div class="file-manager">
                        <a class="btn btn-block btn-primary compose-mail" href="/message/toSendPage">发送留言</a>
                        <div class="space-25"></div>
                        <h5>文件夹</h5>
                        <ul class="folder-list m-b-md" style="padding: 0">
                            <li>
                                <a href="/message/toMessagePage/1?status=-3"> <i class="fa fa-inbox "></i> 留言箱 <span
                                        class="label label-warning pull-right" th:if="${unreads != null}"
                                        th:text="${unreads}">16</span>
                                </a>
                            </li>
                            <li>
                                <a href="/message/toMessagePage/1?status=-1"> <i class="fa fa-file-text-o"></i> 草稿 <span
                                        class="label label-info pull-right" th:if="${draft != null}" th:text="${draft}">1</span>
                                </a>
                            </li>
                            <li>
                                <a href="/message/toMessagePage/1?status=-2"> <i class="fa fa-trash-o"></i> 垃圾箱<span
                                        class="label label-danger pull-right" th:if="${garbage != null}"
                                        th:text="${garbage}">2</span></a>
                            </li>
                        </ul>
                        <div class="clearfix"></div>
                    </div>
                </div>
            </div>
        </div>
        <div class="col-sm-9 animated fadeInRight">
            <div class="mail-box-header">

                <form method="get" action="index.html" class="pull-right mail-search">
                    <div class="input-group">
                        <input type="text" class="form-control input-sm" id="searchTitle" name="search" placeholder="搜索邮件标题"/>
                        <div class="input-group-btn">
                            <button type="button" id="searchButton" class="btn btn-sm btn-primary">
                                搜索
                            </button>
                        </div>
                    </div>
                </form>
                <h2>
                    草稿（<span th:if="${draft != null}" th:text="${draft}"></span>）
                </h2>
                <div class="mail-tools tooltip-demo m-t-md">
                    <div class="btn-group pull-right">
                        <button th:if="${pageInfo.prePage == 0}" disabled="disabled" class="btn btn-white btn-sm"><i
                                class="fa fa-arrow-left"></i>
                        </button>
                        <button th:if="${pageInfo.prePage != 0}" id="prePage" class="btn btn-white btn-sm"><i
                                class="fa fa-arrow-left"></i>
                        </button>
                        <button th:if="${pageInfo.nextPage == 0}" disabled="disabled" class="btn btn-white btn-sm"><i
                                class="fa fa-arrow-right"></i>
                        </button>
                        <button th:if="${pageInfo.nextPage != 0}" id="nextPage" class="btn btn-white btn-sm"><i
                                class="fa fa-arrow-right"></i>
                        </button>

                    </div>
                    <button class="btn btn-white btn-sm" data-toggle="tooltip" data-placement="left" id="refresh" title="刷新邮件列表"><i class="fa fa-refresh"></i> 刷新</button>

                </div>
            </div>
            <div class="mail-box">

                <table class="table table-hover table-mail">
                    <tbody>
                    <tr  th:each="message : ${messages}"
                        th:class="${message.msgReaded == 0 ? 'read' : 'unread'}">
                        <td class="check-mail">
                            <input type="checkbox" class="i-checks"/>
                        </td>
                        <td class="mail-ontact"><a th:href="'/message/detail?messageId='+${message.msgId}" th:text="${message.msgTitle}"></a>
                        </td>
                        <td class="mail-subject" ><a th:href="'/message/detail?messageId='+${message.msgId}"   th:text="${message.msgContent}"></a>
                        </td>
                        <td class=""><span th:text="${message.msgReceiverEmail}"></span>
                        </td>
                        <td class="text-right mail-date" th:text="${#dates.format(message.msgTime,'yyyy年MM月dd日HH时')}"></td>
                    </tr>

                    </tbody>
                </table>


            </div>
        </div>
    </div>
</div>


<script th:src="@{/js/jquery.min.js}"></script>
<script th:src="@{/js/bootstrap.min.js}"></script>


<!-- 自定义js -->
<script th:src="@{/js/content.js}"></script>


<!-- iCheck -->
<script th:src="@{/js/plugins/iCheck/icheck.min.js}"></script>


<script th:inline="javascript">
    $(document).ready(function () {
        $('.i-checks').iCheck({
            checkboxClass: 'icheckbox_square-green',
            radioClass: 'iradio_square-green',
        });
    });
    $(function () {
        $("#refresh").on("click", function () {
            location.reload();
        });
        /* <![CDATA[ */
        $("#searchButton").on("click", function () {
            var title = $("#searchTitle").val();
            location.href = "/message/toMessagePage/1?search=" + title + "&&status=-1";
            // location.href = "/message/toMessagePage/1?status=-3";
        });
        /* ]]> */

        $("#prePage").on("click",function () {
            var prePage = [[${pageInfo.prePage}]];
            console.log(prePage);
            location.href = "/message/toMessagePage/"+prePage+"?status=-1";
        });
        $("#nextPage").on("click",function () {
            var nextPage = [[${pageInfo.nextPage}]];
            console.log(nextPage);
            location.href = "/message/toMessagePage/"+nextPage+"?status=-1";
        });
    });
</script>

</body>

</html>
